﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="pragma" content="no-cache" />
    <meta http-equiv="Cache-Control" content="no-cache, must-revalidate" />
    <meta http-equiv="expires" content="Wed, 26 Feb 1997 08:21:57 GMT" />
    <title>boot</title>
    <link href="style.css" rel="stylesheet" />
</head>
<body>
    <div id="demo">
        <script type="text/html">
            <!--创建一个新view, controller为boot, app为demo-->
            {{view controller="boot" name='view1' app="demo" /}}
            <div class="splice">boot==============================</div>
            <div class="content">
                <!--打印user.desc的内容-->
                {{print user.desc /}}
            </div>
        </script>
    </div>
    <script src="../scripts/bingo2/bingo.min.js"></script>
    <script src="route.js"></script>
    <script type="text/javascript">
        //demo app
        var app = bingo.app('demo');

        //定义controller
        app.controller('boot', function ($view) {

            //定义user变量
            $view.user = {
                desc:'<span>用户描述</span>'
            };


            setTimeout(function () {

                //改变user.desc
                $view.user.desc = '<span>用户描述已经改变</span>';

            }, 2000);
            
        });

        //定义print指令
        app.command('print', function (cp) {

            //观察print的绑定变量，如果改变请求布局
            cp.$layout(function () {
                return cp.$attrs.$result();
            }, function (c) {
                //将绑定内容html到dom
                return cp.$html(c.value);
            });

        });

        //ready
        bingo.ready(function () {
            console.time('boot');
            //使用bingo.compile编译#demo节点
            bingo.compile(document.getElementById('demo')).then(function () {
                console.timeEnd('boot');
            });
        });
    </script>
</body>
</html>
